 <!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>H+ 后台主题UI框架 - 基础表格</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

    <link rel="shortcut icon" href="../statics/hplus/favicon.ico"> <link href="../statics/hplus/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="../statics/hplus/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="../statics/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="../statics/hplus/css/animate.min.css" rel="stylesheet">
    <link href="../statics/hplus/css/style.min.css?v=4.0.0" rel="stylesheet"><base target="_blank">
    <link rel="stylesheet" href="../statics/plugins/dataTables/datatables.min.css">
    <!--<link rel="stylesheet" href="../statics/plugins/dataTables/jquery.dataTables.css">-->
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">


        <!--<div class="row">-->
            <!--<div class="col-sm-6">-->
                <!--<div class="ibox float-e-margins">-->
                    <!--<div class="ibox-title">-->
                        <!--<h5>基本</h5>-->
                        <!--<div class="ibox-tools">-->
                            <!--<a class="collapse-link">-->
                                <!--<i class="fa fa-chevron-up"></i>-->
                            <!--</a>-->
                            <!--<a class="dropdown-toggle" data-toggle="dropdown" href="table_basic.html#">-->
                                <!--<i class="fa fa-wrench"></i>-->
                            <!--</a>-->
                            <!--<ul class="dropdown-menu dropdown-user">-->
                                <!--<li><a href="table_basic.html#">选项1</a>-->
                                <!--</li>-->
                                <!--<li><a href="table_basic.html#">选项2</a>-->
                                <!--</li>-->
                            <!--</ul>-->
                            <!--<a class="close-link">-->
                                <!--<i class="fa fa-times"></i>-->
                            <!--</a>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="ibox-content">-->

                        <!--<table class="table">-->
                            <!--<thead>-->
                                <!--<tr>-->
                                    <!--<th>#</th>-->
                                    <!--<th>姓名</th>-->
                                    <!--<th>性别</th>-->
                                    <!--<th>年龄</th>-->
                                <!--</tr>-->
                            <!--</thead>-->
                            <!--<tbody>-->
                                <!--<tr>-->
                                    <!--<td>1</td>-->
                                    <!--<td>张三</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>23</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>2</td>-->
                                    <!--<td>李四</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>27</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>3</td>-->
                                    <!--<td>王麻子</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>65</td>-->
                                <!--</tr>-->
                            <!--</tbody>-->
                        <!--</table>-->

                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="col-sm-6">-->
                <!--<div class="ibox float-e-margins">-->
                    <!--<div class="ibox-title">-->
                        <!--<h5>斑马纹效果</h5>-->
                        <!--<div class="ibox-tools">-->
                            <!--<a class="collapse-link">-->
                                <!--<i class="fa fa-chevron-up"></i>-->
                            <!--</a>-->
                            <!--<a class="dropdown-toggle" data-toggle="dropdown" href="table_basic.html#">-->
                                <!--<i class="fa fa-wrench"></i>-->
                            <!--</a>-->
                            <!--<ul class="dropdown-menu dropdown-user">-->
                                <!--<li><a href="table_basic.html#">选项1</a>-->
                                <!--</li>-->
                                <!--<li><a href="table_basic.html#">选项2</a>-->
                                <!--</li>-->
                            <!--</ul>-->
                            <!--<a class="close-link">-->
                                <!--<i class="fa fa-times"></i>-->
                            <!--</a>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="ibox-content">-->

                        <!--<table class="table table-striped">-->
                            <!--<thead>-->
                                <!--<tr>-->
                                    <!--<th>#</th>-->
                                    <!--<th>数据</th>-->
                                    <!--<th>用户</th>-->
                                    <!--<th>值</th>-->
                                <!--</tr>-->
                            <!--</thead>-->
                            <!--<tbody>-->
                                <!--<tr>-->
                                    <!--<td>1</td>-->
                                    <!--<td><span class="line">5,3,2,-1,-3,-2,2,3,5,2</span>-->
                                    <!--</td>-->
                                    <!--<td>张三</td>-->
                                    <!--<td class="text-navy"> <i class="fa fa-level-up"></i> 40%</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>2</td>-->
                                    <!--<td><span class="line">5,3,9,6,5,9,7,3,5,2</span>-->
                                    <!--</td>-->
                                    <!--<td>李四</td>-->
                                    <!--<td class="text-warning"> <i class="fa fa-level-down"></i> -20%</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>3</td>-->
                                    <!--<td><span class="line">1,6,3,9,5,9,5,3,9,6,4</span>-->
                                    <!--</td>-->
                                    <!--<td>王麻子</td>-->
                                    <!--<td class="text-navy"> <i class="fa fa-level-up"></i> 26%</td>-->
                                <!--</tr>-->
                            <!--</tbody>-->
                        <!--</table>-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="row">-->
            <!--<div class="col-sm-6">-->
                <!--<div class="ibox float-e-margins">-->
                    <!--<div class="ibox-title">-->
                        <!--<h5>边框</h5>-->
                        <!--<div class="ibox-tools">-->
                            <!--<a class="collapse-link">-->
                                <!--<i class="fa fa-chevron-up"></i>-->
                            <!--</a>-->
                            <!--<a class="dropdown-toggle" data-toggle="dropdown" href="table_basic.html#">-->
                                <!--<i class="fa fa-wrench"></i>-->
                            <!--</a>-->
                            <!--<ul class="dropdown-menu dropdown-user">-->
                                <!--<li><a href="table_basic.html#">选项1</a>-->
                                <!--</li>-->
                                <!--<li><a href="table_basic.html#">选项2</a>-->
                                <!--</li>-->
                            <!--</ul>-->
                            <!--<a class="close-link">-->
                                <!--<i class="fa fa-times"></i>-->
                            <!--</a>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="ibox-content">-->

                        <!--<table class="table table-bordered">-->
                            <!--<thead>-->
                                <!--<tr>-->
                                    <!--<th>#</th>-->
                                    <!--<th>姓名</th>-->
                                    <!--<th>性别</th>-->
                                    <!--<th>年龄</th>-->
                                <!--</tr>-->
                            <!--</thead>-->
                            <!--<tbody>-->
                                <!--<tr>-->
                                    <!--<td>1</td>-->
                                    <!--<td>张三</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>23</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>2</td>-->
                                    <!--<td>李四</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>27</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>3</td>-->
                                    <!--<td>王麻子</td>-->
                                    <!--<td>男</td>-->
                                    <!--<td>65</td>-->
                                <!--</tr>-->
                            <!--</tbody>-->
                        <!--</table>-->

                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="col-sm-6">-->
                <!--<div class="ibox float-e-margins">-->
                    <!--<div class="ibox-title">-->
                        <!--<h5>鼠标经过</h5>-->
                        <!--<div class="ibox-tools">-->
                            <!--<a class="collapse-link">-->
                                <!--<i class="fa fa-chevron-up"></i>-->
                            <!--</a>-->
                            <!--<a class="dropdown-toggle" data-toggle="dropdown" href="table_basic.html#">-->
                                <!--<i class="fa fa-wrench"></i>-->
                            <!--</a>-->
                            <!--<ul class="dropdown-menu dropdown-user">-->
                                <!--<li><a href="table_basic.html#">选项1</a>-->
                                <!--</li>-->
                                <!--<li><a href="table_basic.html#">选项2</a>-->
                                <!--</li>-->
                            <!--</ul>-->
                            <!--<a class="close-link">-->
                                <!--<i class="fa fa-times"></i>-->
                            <!--</a>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="ibox-content">-->

                        <!--<table class="table table-hover">-->
                            <!--<thead>-->
                                <!--<tr>-->
                                    <!--<th>#</th>-->
                                    <!--<th>数据</th>-->
                                    <!--<th>用户</th>-->
                                    <!--<th>值</th>-->
                                <!--</tr>-->
                            <!--</thead>-->
                            <!--<tbody>-->
                                <!--<tr>-->
                                    <!--<td>1</td>-->
                                    <!--<td><span class="line">5,3,2,-1,-3,-2,2,3,5,2</span>-->
                                    <!--</td>-->
                                    <!--<td>张三</td>-->
                                    <!--<td class="text-navy"> <i class="fa fa-level-up"></i> 40%</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>2</td>-->
                                    <!--<td><span class="line">5,3,9,6,5,9,7,3,5,2</span>-->
                                    <!--</td>-->
                                    <!--<td>李四</td>-->
                                    <!--<td class="text-warning"> <i class="fa fa-level-down"></i> -20%</td>-->
                                <!--</tr>-->
                                <!--<tr>-->
                                    <!--<td>3</td>-->
                                    <!--<td><span class="line">1,6,3,9,5,9,5,3,9,6,4</span>-->
                                    <!--</td>-->
                                    <!--<td>王麻子</td>-->
                                    <!--<td class="text-navy"> <i class="fa fa-level-up"></i> 26%</td>-->
                                <!--</tr>-->
                            <!--</tbody>-->
                        <!--</table>-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>自定义响应式表格</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="../statics/hplus/table_basic.html#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="../statics/hplus/table_basic.html#">选项1</a>
                                </li>
                                <li><a href="../statics/hplus/table_basic.html#">选项2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-5 m-b-xs">
                                <select class="input-sm form-control input-s-sm inline">
                                    <option value="0">请选择</option>
                                    <option value="1">选项1</option>
                                    <option value="2">选项2</option>
                                    <option value="3">选项3</option>
                                </select>
                            </div>
                            <div class="col-sm-4 m-b-xs">
                                <div data-toggle="buttons" class="btn-group">
                                    <label class="btn btn-sm btn-white">
                                        <input type="radio" id="option1" name="options">天</label>
                                    <label class="btn btn-sm btn-white active">
                                        <input type="radio" id="option2" name="options">周</label>
                                    <label class="btn btn-sm btn-white">
                                        <input type="radio" id="option3" name="options">月</label>
                                </div>
                            </div>
                            <div class="col-sm-3">
                                <div class="input-group">
                                    <input type="text" placeholder="请输入关键词" class="input-sm form-control"> <span class="input-group-btn">
                                        <button type="button" class="btn btn-sm btn-primary"> 搜索</button> </span>
                                </div>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <!--<table class="table table-striped">-->
                                <!--<thead>-->
                                    <!--<tr>-->

                                        <!--<th></th>-->
                                        <!--<th>项目</th>-->
                                        <!--<th>进度</th>-->
                                        <!--<th>任务</th>-->
                                        <!--<th>日期</th>-->
                                        <!--<th>操作</th>-->
                                    <!--</tr>-->
                                <!--</thead>-->
                                <!--<tbody>-->
                                    <!--<tr>-->
                                        <!--<td>-->
                                            <!--<input type="checkbox" checked class="i-checks" name="input[]">-->
                                        <!--</td>-->
                                        <!--<td>米莫说｜MiMO Show</td>-->
                                        <!--<td><span class="pie">0.52/1.561</span>-->
                                        <!--</td>-->
                                        <!--<td>20%</td>-->
                                        <!--<td>2014.11.11</td>-->
                                        <!--<td><a href="../statics/hplus/table_basic.html#"><i class="fa fa-check text-navy"></i></a>-->
                                        <!--</td>-->
                                    <!--</tr>-->
                                    <!--<tr>-->
                                        <!--<td>-->
                                            <!--<input type="checkbox" class="i-checks" name="input[]">-->
                                        <!--</td>-->
                                        <!--<td>商家与购物用户的交互试衣应用</td>-->
                                        <!--<td><span class="pie">6,9</span>-->
                                        <!--</td>-->
                                        <!--<td>40%</td>-->
                                        <!--<td>2014.11.11</td>-->
                                        <!--<td><a href="../statics/hplus/table_basic.html#"><i class="fa fa-check text-navy"></i></a>-->
                                        <!--</td>-->
                                    <!--</tr>-->
                                    <!--<tr>-->
                                        <!--<td>-->
                                            <!--<input type="checkbox" class="i-checks" name="input[]">-->
                                        <!--</td>-->
                                        <!--<td>天狼-&#45;&#45;智能硬件项目</td>-->
                                        <!--<td><span class="pie">3,1</span>-->
                                        <!--</td>-->
                                        <!--<td>75%</td>-->
                                        <!--<td>2014.11.11</td>-->
                                        <!--<td><a href="../statics/hplus/table_basic.html#"><i class="fa fa-check text-navy"></i></a>-->
                                        <!--</td>-->
                                    <!--</tr>-->
                                    <!--<tr>-->
                                        <!--<td>-->
                                            <!--<input type="checkbox" class="i-checks" name="input[]">-->
                                        <!--</td>-->
                                        <!--<td>线下超市+线上商城+物流配送互联系统</td>-->
                                        <!--<td><span class="pie">4,9</span>-->
                                        <!--</td>-->
                                        <!--<td>18%</td>-->
                                        <!--<td>2014.11.11</td>-->
                                        <!--<td><a href="../statics/hplus/table_basic.html#"><i class="fa fa-check text-navy"></i></a>-->
                                        <!--</td>-->
                                    <!--</tr>-->
                                <!--</tbody>-->
                            <!--</table>-->

                            <table id="tableList" class="table table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th class="text-center">编号</th>
                                    <th class="text-center">数据库</th>
                                    <th class="text-center">表</th>
                                    <th class="text-center">注释</th>
                                    <th class="text-center">创建时间</th>
                                </tr>
                                </thead>
                            </table>
                        </div>

                    </div>
                </div>
            </div>

        </div>
    </div>
    <script src="../statics/hplus/js/jquery.min.js?v=2.1.4"></script>
    <script src="../statics/hplus/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="../statics/hplus/js/plugins/peity/jquery.peity.min.js"></script>
    <script src="../statics/hplus/js/content.min.js?v=1.0.0"></script>
    <script src="../statics/hplus/js/plugins/iCheck/icheck.min.js"></script>
    <script src="../statics/hplus/js/demo/peity-demo.min.js"></script>
    <!--<script src="../statics/plugins/dataTables/datatables.min.js"></script>-->
    <script src="../statics/hplus/js/plugins/dataTables/jquery.dataTables.js"></script>
    <!--<script src="../statics/hplus/js/plugins/dataTables/dataTables.bootstrap.js"></script>-->
    <script>
        var tableList;
        var languageConfig = {
            "search": "查询:",
            "lengthMenu": "每页显示 _MENU_ 条记录 ",
            "zeroRecords": "对不起，没找到任何记录",
            "info": "显示 _PAGE_ 到 _PAGES_页,共 _TOTAL_ 条",
            "infoEmpty": "没有记录",
            "infoFiltered": "( _MAX_ 条记录显示)",
            "paginate": {
                "first": "首页",
                "last": "末页",
                "next": "下一页",
                "previous": "上一页"
            },
            "loadingRecords": "加载中...",
            "processing": "处理中..."
        };

        //取参
        function getParam() {
            var param = {page:1,length:10};

            // var bookTimeStart = $("#bookTimeStart").val();
            // if(bookTimeStart){
            //     param.bookTimeStart = bookTimeStart;
            // }
            //
            // var bookTimeEnd = $("#bookTimeEnd").val();
            // if(bookTimeEnd){
            //     param.bookTimeEnd = bookTimeEnd;
            // }
            return param;
        }

        function timeToString(dateTime){
            if(dateTime==null){
                return "";
            }
            var date = new Date(dateTime);
            var Y = date.getFullYear();
            var M = (date.getMonth()+1)<10?("0"+(date.getMonth()+1)) : (date.getMonth()+1);
            var D = date.getDate()<10?("0"+date.getDate()) : date.getDate();
            var H = date.getHours();
            var m = date.getMinutes();
            var s = date.getSeconds();
            return Y + '-' + M + '-' + D + " " + H + ":" + m + ":" + s;
        }

        function doSearch() {
            tableList = $("#tableList").DataTable({
                serverSide : true,                                  //服务器
                lengthChange : true,                                //可以改变每页条数
                lengthMenu : [10, 50, 100],                         //分页选项
                pagingType : "full_numbers",						//翻页按钮类型
                searching : false,                                  //关闭本地搜索
                ordering : false,                                   //关闭本地排序
                autoWidth : false,                                  //关闭自适应宽度
                destroy : true,                                     //方便第二次加载
                language : languageConfig,
                ajax : {
                    type : "post",
                    url : '/codeGen/getTableList',
                    data : function(param){                         //入参
                        $.extend(true, param, getParam())
                    },
                    dataSrc : function (result) {                   //返参
                        return result;
                    }
                },
                columns : [
                    {data: null},
                    {data: null},
                    {data: null},
                    {data: null},
                    {data: null}
                ],
                columnDefs : [
                    {targets : 1, width : '20%', className : 'text-center',                 //
                        render : function(data, type, row, meta) {
                            return row.dbName;
                        }
                    },
                    {targets : 2, width : '20%', className : 'text-center',                 //
                        render : function(data, type, row, meta) {
                            return row.tableName;
                        }
                    },
                    {targets : 3, width : '20%', className : 'text-center',                 //
                        render : function(data, type, row, meta) {
                            return row.tableDesc;
                        }
                    },
                    {targets : 4, width : '20%', className : 'text-center',                 //
                        render : function(data, type, row, meta) {
                            return timeToString(row.createTime);
                        }
                    }
                    // ,
                    // {targets : 3, width : '25%', className : 'text-center',                 //操作
                    //     render : function (data, type, row, meta){
                    //         var str= '';
                    //         str += '<button class="btn btn-xs btn-success" onclick="exportExcel('+row.id+',\''+row.url+'\',\''+row.fileName+'.xls\');">导出</button>';
                    //         str += '<button class="btn btn-xs btn-success" onclick="showExportLog(' + row.id + ',\''+ row.fileName +'\','+row.bookTime+');" style="margin-left: 10px">下载日志</button>';
                    //         return str;
                    //     }
                    // }
                ],
                fnDrawCallback : function(){
                    this.api().column(0).nodes().each(function(cell, i) {
                        cell.innerHTML = '<div class="text-center">' + (i + 1) + '</div>';
                    });
                }
            });
        }

        $(document).ready(function(){
            $(".i-checks").iCheck({checkboxClass:"icheckbox_square-green",radioClass:"iradio_square-green",})

            doSearch();
            //     type : 'post',
            //     url : '../codeGen/getTableList',
            //     data : {page:,length,},
            //     success : function () {
            //
            //     }
            // });
        });
    </script>
    <script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
</body>

</html>